<template>
    <view class="example">
        <!-- 基础用法，不包含校验规则 -->
        <uni-forms ref="baseForm" label-position="top">
            <uni-forms-item label="官方地址">
                <uni-easyinput v-model="chatConfig.baseUrl" placeholder="请输入姓名" />
            </uni-forms-item>
            <uni-forms-item label="密钥key">
                <uni-easyinput v-model="chatConfig.key" placeholder="请输入官方密钥" />
            </uni-forms-item>
            <uni-forms-item label="连接类型">
                <uni-data-select
                    v-model="chatConfig.proxyType"
                    :localdata="typeArr"
                ></uni-data-select>
            </uni-forms-item>
            <uni-forms-item label="代理Ip">
                <uni-easyinput v-model="chatConfig.proxyIp" placeholder="请输入代理Ip" />
            </uni-forms-item>
            <uni-forms-item label="代理端口">
                <uni-easyinput v-model="chatConfig.port" placeholder="请输入代理端口" />
            </uni-forms-item>
        </uni-forms>
        <button type="primary" @click="submit">提交</button>
    </view>
</template>

<script lang="ts" setup>
    import { ref } from 'vue';
    import type { ChatConfig } from '@/types/chatgpt';
    import { getChatConfig, saveChatConfig } from '@/api/chatgpt';
    import { onShow } from '@dcloudio/uni-app';
    const chatConfig = ref<ChatConfig>({
        baseUrl: '',
        key: '',
        proxyType: '',
        proxyIp: '',
        port: 0
    });
    onShow(async () => {
        await loadChatConfig();
    });
    async function loadChatConfig() {
        getChatConfig().then(({ data }) => {
            chatConfig.value = data;
        });
    }
    function submit() {
        saveChatConfig(chatConfig.value).then((res) => {
            if (res.code === 200) {
                uni.showToast({
                    title: '成功',
                    duration: 2000
                });
            }
        });
    }
    const typeArr = ref([
        {
            value: 'PROXY',
            text: '代理'
        },
        {
            value: 'DIRECT',
            text: '直连'
        }
    ]);
</script>

<style lang="scss" scoped>
    .example {
        padding: 20px;
        background-color: #fff;
    }
</style>
